<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="s"  uri="/struts-tags"%>

<script type="text/javascript" src="<%=request.getContextPath()%>/ext/jquery_jcrop/jquery.Jcrop.min.js"></script>
<link rel="stylesheet" href="<%=request.getContextPath()%>/ext/jquery_jcrop/jquery.Jcrop.min.css">

<title>文件浏览</title>

  预览： 

  ${sessionScope.showfile}



<script type="text/javascript">
	<!--
	jQuery(function($){
    var jcrop_api,
        boundx,
        boundy,
        
        $pcnt = $("#preview"),
        $pimg = $("#preview img"),
        xsize = $pcnt.width(),
        ysize = $pcnt.height();
    $("#target").Jcrop({
      onChange: updatePreview,
      onSelect: updatePreview,
      aspectRatio: 1
    },function(){
      var bounds = this.getBounds();
      boundx = bounds[0];
      boundy = bounds[1];
      jcrop_api = this;
    });

    function updatePreview(c) {
      if (parseInt(c.w) > 0){
        var rx = xsize / c.w;
        var ry = ysize / c.h;
        $pimg.css({
          width: Math.round(rx * boundx) + 'px',
          height: Math.round(ry * boundy) + 'px',
          marginLeft: '-' + Math.round(rx * c.x) + 'px',
          marginTop: '-' + Math.round(ry * c.y) + 'px'
        });
        $('#width').val(c.w);  //c.w 裁剪区域的宽  
        $('#height').val(c.h); //c.h 裁剪区域的高  
        $('#x').val(c.x);  //c.x 裁剪区域左上角顶点相对于图片左上角顶点的x坐标  
        $('#y').val(c.y);  //c.y 裁剪区域顶点的y坐标</spa
      }
    };

  });

-->
</script>
